import {
  getRecomendList,
  getSwiper,
  getSongMenuList
} from "../../services/music"
import querySelect from "../../utils/query-select"

// import throttle from "../../utils/throttle"
import {
  throttle
} from 'underscore'
import recomendStore from "../../store/recomendStore"
import rankingStore from "../../store/rankingStore"
import playerStore from "../../store/playerStore"
const querySelectThrottle = throttle(querySelect, 100)
const app = getApp()
Page({

  data: {
    SwpierData: [],
    // 轮播图高度默认是150 图片宽度固定 高度不够高 。所以 想设置
    // 轮播图高度和图片的高度一致。那就需要获取到图片的高的设置给轮播图
    // 最后做一下节流。
    bannerHeight: 150,
    recomendList: [],
    // 热门歌单
    hotMenuList: [],
    reMenuList: [], //推荐歌单
    screenWidth: 375,
    isRankingData:false,
    // 巅峰榜
    rankingInfos: {}
  },
  onSearch() {
    wx.navigateTo({
      url: '/pages/detail-search/detail-search',
    })
  },
  onLoad() {
    this.fetchSwiper()
    // this.fetchRecomendList()
    // 在store中请求数据recommendList
    recomendStore.onState("recomendSongInfo", this.handlercommedList)
    rankingStore.onState("newRanking", this.handlernewRanking)
    rankingStore.onState("originRanking", this.handleroriginRanking)
    rankingStore.onState("upRanking", this.handlerupRanking)
    // 发起网络请求请求数据recommendList
    recomendStore.dispatch('fetchRecomendSongsAction')
    rankingStore.dispatch('fetchRankingDataAction')
    this.fetchgetSongMenuList()
    // 获取屏幕宽度
    this.setData({
      screenWidth: app.globalData.screenWidth
    })
  },
  async fetchSwiper() {
    const res = await getSwiper()
    // console.log(res);
    this.setData({
      SwpierData: res.banners
    })
  },
  // 获取热门歌单
  async fetchgetSongMenuList() {
    getSongMenuList().then(res => {
      // console.log(res);
      this.setData({
        hotMenuList: res.playlists
      })
    })
    getSongMenuList('华语').then(res => {
      // console.log(res);
      this.setData({
        reMenuList: res.playlists
      })
    })
  },


  // async   fetchRecomendList()  {
  //   const res = await getRecomendList(3778678)
  //   // console.log(res.playlist.tracks);
  //   const resList=res.playlist.tracks.slice(0,6)
  //   console.log(resList);
  //   this.setData({
  //     recomendList:resList
  //   })
  // },
  // 图片加载完
  onImageLoad() {
    // console.log('onimageload');
    // 获取image组件高度，设置给轮播图
    // const query = wx.createSelectorQuery()
    // query.select('.banner-image').boundingClientRect()
    // query.exec(res => {
    //   this.setData({
    //     bannerHeight: res[0].height
    //   })
    // })
    querySelectThrottle('.banner-image').then(res => {

      this.setData({
        bannerHeight: res[0].height
      })
    })
  },
  //监听组件的更多的点击
  onMoreClick() {
    console.log('onMoreClick');
    wx.navigateTo({
      url: '/pages/detail-song/detail-song?type=recommend',
    })
  },
  onSongItemTap(event){
    // console.log("onSongItemTap");
    // console.log(this.data.recomendList);
    const index =event.currentTarget.dataset.index
    playerStore.setState("playSongList",this.data.recomendList)
    playerStore.setState("playSongIndex", index)
  },
  // ----store中获取数据
  handlercommedList(value){
      if(!value.tracks) return
      this.setData({
        recomendList: value.tracks.slice(0, 6)
      })
   
    },
  handlernewRanking(value) {
    // console.log('新歌榜', value);
    if(!value.name) return
    this.setData({ isRankingData:true})
    const newRankingInfos = {
      ...this.data.rankingInfos,
      newRanking: value
    }
    this.setData({
      rankingInfos: newRankingInfos
    })
  },
  handleroriginRanking(value) {
    // console.log('原创榜', value);
    if(!value.name) return
    this.setData({ isRankingData:true})

    const newRankingInfos = {
      ...this.data.rankingInfos,
      originRanking: value
    }
    this.setData({
      rankingInfos: newRankingInfos
    })
  },
  handlerupRanking(value) {
    // console.log('飙升榜', value);
    if(!value.name) return
    this.setData({ isRankingData:true})

    const newRankingInfos = {
      ...this.data.rankingInfos,
      upRanking: value
    }
    this.setData({
      rankingInfos: newRankingInfos
    })
  },
  onUnload() {
    // 卸载监听 
   
    rankingStore.offState("newRanking", this.handlernewRanking)
    rankingStore.offState("originRanking", this.handleroriginRanking)
    rankingStore.offState("upRanking", this.handlerupRanking)
  }
})